<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <!-- <a-col :span="24">
             <a-form-model-item label="所属门店" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="shopId">
               <a-select type="list_multi" v-model="model.shopId" dictCode="" placeholder="请选择所属门店">
                 <a-select-option v-for="(i, k) in shopList" :key="i.id">
                   {{i.name}}
                 </a-select-option>
               </a-select>
             </a-form-model-item>
             &lt;!&ndash;              <a-input v-model="model.shopId" placeholder="请输入店铺"  >1</a-input>&ndash;&gt;
           </a-col>-->
          <a-col :span="24">
            <a-form-model-item label="分类名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
              <a-input v-model="model.name" placeholder="请输入分类名称"></a-input>
            </a-form-model-item>
          </a-col>
          <!-- <a-col :span="24">
            <a-form-model-item label="图标" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="picture">
              <j-image-upload biz-path="laile2/goods" acceptFormat="image/png, image/jpeg" v-model="model.icon">
              </j-image-upload>
            </a-form-model-item>
          </a-col> -->
          <!-- <a-col :span="24">
             <a-form-model-item label="是否删除" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="delFlag">
               <j-dict-select-tag type="list" v-model="model.delFlag" dictCode="mk_whether" placeholder="请选择是否删除" />
             </a-form-model-item>
           </a-col>-->
          <!-- <a-col :span="24">
            <a-form-model-item label="是否首页显示" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="isIndex">
              <j-dict-select-tag type="list" v-model="model.isIndex" dictCode="mk_whether" placeholder="请选择是否显示" />
            </a-form-model-item>
          </a-col> -->
          <a-col :span="24">
            <a-form-model-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="status">
              <j-dict-select-tag type="list" v-model="model.status" dictCode="status" placeholder="调整状态" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="排序" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="sort">
              <a-input-number v-model="model.sort" placeholder="请输入排序，默认0" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <!-- <a-col :span="24">
            <a-form-model-item label="描述" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="mark">
              <a-input v-model="model.mark" placeholder="请输入备注"></a-input>
            </a-form-model-item>
          </a-col> -->
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

import { httpAction, getAction } from '@/api/manage'
import { validateDuplicateValue } from '@/utils/util'

export default {
  name: 'GoodsSortForm',
  components: {},
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      shopList: [],

      model: {
        sort: 0
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false,
      validatorRules: {
        shopId: [
          { required: true, message: '请输入店铺!' }
        ],
        name: [
          { required: true, message: '请输入属性名称!' }
        ],
        isShow: [
          { required: true, message: '请输入是否显示!' }
        ],
        sort: [
          { pattern: /^-?\d+$/, message: '请输入整数!' }
        ]
      },
      url: {
        add: '/goodKategorie/mkGoodsKategorie/add',
        edit: '/goodKategorie/mkGoodsKategorie/edit',
        queryById: '/goodKategorie/mkGoodsKategorie/queryById',
        // getShopListUrl: '/goodKategorie/mkGoodsKategorie/list'
        replyList: '/goodKategorie/mkGoodsKategorie/list'
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  created() {
    //备份model原始值

    this.modelDefault = JSON.parse(JSON.stringify(this.model))
  },
  methods: {
    // getShopListUrl() {
    //   this.shopList = []
    //   getAction(this.url.getShopListUrl).then(res => {
    //     if (res.success) {
    //       let result = res.result
    //       result.forEach((e) => {
    //         this.shopList.push(e)
    //       })
    //     }
    //   })
    //   console.log(this.shopList)

    // },
    loadReply() {
      if (this.title != '详情') return
      this.replyTableData.loading = true
      console.log(this.model)
      getAction(this.url.replyList, { infoId: this.model.id }).then(res => {
        this.replyTableData.loading = false
        if (res.success) this.replyTableData.dataSource = res.result.records
      })
    },
    add() {
      this.edit(this.modelDefault)
    },
    edit(record) {
      this.loadReply()
      this.model = Object.assign({}, record)
      this.visible = true
    },
    submitForm() {
      const that = this
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true
          let httpurl = ''
          let method = ''
          if (!this.model.id) {
            httpurl += this.url.add
            method = 'post'
          } else {
            httpurl += this.url.edit
            method = 'put'
          }
          this.model.sort = '0'
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.result)
              that.$emit('ok')
            } else {
              that.$message.warning(res.message)
            }
          }).finally(() => {
            that.confirmLoading = false
          })
        }

      })
    },
    popupCallback(value, row) {
      this.model = Object.assign(this.model, row)
    }
  }
}
</script>